<!DOCTYPE html>
<html>
<#include "include/common-head.ftl"/>
<body class="bg-2">
<section class="loginBox">
    <form action="/register" method="post">
        <dl>
            <dd class="userEmail loginLine">
                <input type="text" name="phone" value="${phone!}" id="username" placeholder="请输入手机号"/>
                <i></i>
            </dd>
            <dd class="userEmail userPw loginLine">
                <input type="password" name="password" id="userpw" placeholder="请输入密码"/>
                <i></i>
            </dd>
            <dd class="userEmail userKey loginLine">
                <input type="text" name="" id="" placeholder="请输入邮箱验证码"/>
                <a>发送验证码</a>
                <i></i>
            </dd>
            <dd class="userEmail protocolBar">
                <a id="check" class="checkBox-1 agreeBtn"></a>
                <p>
                    已同意并阅读<a>《天颐创想服务协议》</a>
                </p>
            </dd>
            <dd class="loginbtnBar">
                <a onclick="$('form').submit();">立即注册</a>
            </dd>
        </dl>
    </form>
</section>
<section class="loginMark">已有账号？<a href="/view/login">立即登录</a></section>
</body>
<script type="text/javascript">
    $(function () {
        $("#check").click(function () {
            $(this).toggleClass("checkBox-2");
        });

        $('form').submit(function () {
            var phone = $("#username").val();
            var password = $("#userpw").val();
            if (phone.length !== 11 || phone.substr(0, 1) !== '1') {
                alert("电话号码格式错误");
                return false;
            }
            if (password.length < 6 || password.length > 20) {
                alert("密码长度为6到20位");
                return false;
            }
            if (!$("#check").hasClass("checkBox-2")) {
                alert("请先同意服务协议");
                return false;
            }
            return true;
        });
    })
</script>
</html>
